<%@ page contentType="text/html;charset=UTF-8" language="java" %>

<%@include file="common/common-head.jsp"%>

<body class="pace-top">
<!-- begin #page-loader -->
<div id="page-loader" class="fade show">
  <span class="spinner"></span>
</div>
<!-- end #page-loader -->

<!-- begin #page-container -->
<div id="page-container" class="fade">
  <!-- begin login -->
  <div class="login login-with-news-feed">
    <!-- begin news-feed -->
    <div class="news-feed">
      <div class="news-image" style="background-image: url(${colorAdmin}/assets/img/login-bg/login-bg-11.jpg)"></div>
      <div class="news-caption">
        <h4 class="caption-title"><b>Color</b> Admin App</h4>
        <p>
          Download the Color Admin app for iPhone®, iPad®, and Android™. Lorem ipsum dolor sit amet, consectetur adipiscing elit.
        </p>
      </div>
    </div>
    <!-- end news-feed -->
    <!-- begin right-content -->
    <div class="right-content">
      <!-- begin login-header -->
      <div class="login-header">
        <div class="brand">
          <span class="logo"></span> <b>Color</b> Admin
          <small>responsive bootstrap 4 admin template</small>
        </div>
        <div class="icon">
          <i class="fa fa-sign-in-alt"></i>
        </div>
      </div>
      <!-- end login-header -->
      <!-- begin login-content -->
      <div class="login-content">
        <form action="index.html" method="GET" class="margin-bottom-0">
          <div class="form-group m-b-15">
            <input type="text" class="form-control form-control-lg" placeholder="用户名" required id="userName" />
          </div>
          <div class="form-group m-b-15">
            <input type="password" class="form-control form-control-lg" placeholder="密码" required id="password" />
          </div>
          <div class="checkbox checkbox-css m-b-30">
            <input type="checkbox" id="rememberMe" />
            <label for="rememberMe">
              Remember Me
            </label>
          </div>
          <div class="login-buttons">
            <button type="button" class="btn btn-success btn-block btn-lg" id="loginFinish">登 录</button>
          </div>
          <div class="m-t-20 m-b-40 p-b-40 text-inverse">
            Not a member yet? Click <a href="register_v3.html">here</a> to register.
          </div>
          <hr />
          <p class="text-center text-grey-darker mb-0">
            &copy; Color Admin All Right Reserved 2020
          </p>
        </form>
      </div>
      <!-- end login-content -->
    </div>
    <!-- end right-container -->
  </div>
  <!-- end login -->
  <%@include file="common/common-theme.jsp"%>

</div>
<!-- end page container -->
<%@include file="common/common-script.jsp"%>

<script>
  var ctx = '${basePath}'

  $(function(){
    $("#loginFinish").click(function(){
      var userName = $("#userName").val()
      var password = $("#password").val()
      var rememberMe = $("#rememberMe").prop('checked')

      $.ajax({
        type: "get",
        url: ctx+"loginFinish?userName="+userName+"&password="+password+"&rememberMe="+rememberMe,
        success: function(ret){
          if(ret==="1000"){
            window.location.href=ctx+'index'
          }else{
            swal({
              title: '错误！',
              text: '账号密码错误，请重新输入或者重新注册!',
              icon: 'error',
              buttons: {
                cancel: {
                  text: 'Cancel',
                  value: null,
                  visible: true,
                  className: 'btn btn-default',
                  closeModal: true,
                },
                confirm: {
                  text: 'Warning',
                  value: true,
                  visible: true,
                  className: 'btn btn-danger',
                  closeModal: true
                }
              }
            });
          }
        }
      });
    })
  })
</script>

</body>
</html>
